<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>简单交互</title>
		
		<script>
		function showClick(){
			alert("由点击事件触发的警告！");
		}
		function choose(){
			var result = confirm("你真TMD很行啊，行啊你！！");
			var resultD = document.getElementById("show_click");
			if(result == true){
				resultD.innerHTML = "妈了个巴子的！";
			}else{
				resultD.innerHTML = "我。。。。。。。";
			}
		}
		function btnClick(){
			prompt("我已经不爱你了。。");
		}
			//alert("警告！");
		</script>
		<style>
		
			#show_click{
				text-align: center;
				width: 100px;
				height: 50px;
				border: 2px dashed darkgoldenrod;
			}
			.choose_dialog{
				width: 100px;
				height: 100px;
				margin: 20px;
				background-color: blanchedalmond;
				color:blue;
			}
		</style>
	</head>
	<!--
		html中，所有标签都可以设置点击事件
		用户鼠标点击时要给出回馈操作
		定义标签，设置id
		在js代码中提供点击函数
		标签描述中设置点击事件onclick
	-->
	<body>
	<div id="show_click" onclick="showClick()">点击事件</div>
	<div class="choose_dialog" onclick="choose()">请再次确认</div>
	<input type="button" value="请输入" onclick="btnClick()" />
	</body>
</html>
